import { InputProps } from "antd"
import { useState } from "react"

import CommonInput from "../../common/commonInput"

const FundsInputText = ({
	onTextChange,
	submitSearch,
	labelId,
	fieldName,
	placeholderId,
	...props
}: {
	onTextChange: Function
	submitSearch?: Function
	labelId: string
	fieldName: string
	placeholderId: string
} & InputProps) => {
	const [text, setText] = useState("")

	const handleTextChange = (newText: string) => {
		setText(newText)
		onTextChange(newText)
	}

	const enterSearch = () => {
		if (submitSearch) submitSearch()
	}

	return (
		<CommonInput
			placeholderId={placeholderId}
			fieldName={fieldName}
			labelId={labelId}
			value={text}
			onChange={(e: React.ChangeEvent<HTMLInputElement>) => handleTextChange(e.target.value.replace(/[\u4E00-\u9FA5]/g, ""))}
			onBlur={() => handleTextChange(text.trim())}
			onPressEnter={enterSearch}
			allowClear
			{...props}
		/>
	)
}

export default FundsInputText
